import React, { Component } from 'react';
import axios from 'axios';
import cookie from 'react-cookies';
import MenuHead from '../comm/menuHead';
import Table from '../comm/table';

class QueryBdndFile extends Component {
  state = {
    keys: "",
    head: [
      {en: 'file', ch: '文件名'},
      {en: 'dir', ch: '路径'},
      {en: 'tag', ch: '标签'},
    ],
    data: [],
    record_count: 0,
    data_show: [],
  }
  setKeys = (e) => {
    this.setState({
      keys: e.target.value,
    })
  }
  cleanKeys = () => {
    this.setState({
      keys: "",
      data: [],
    })
  }
  queryBdndFile = (from, page) => {
    if(this.state.data.length !== 0) {
      this.setState({
        data_show: this.state.data.slice(from, from + page),
      });
      return;
    }
    if(this.state.keys === "") {
      alert("关键字为空");
      return;
    }
    let userName = cookie.load('login-name');
    let loginID = cookie.load('login-id');
    axios.post("/app/queryBdndFile", {
      "keys": this.state.keys,
      "userName": userName,
      "loginID": loginID,
    }).then((res) => {
      if("请先登录" === res.data.error) {
          this.props.history.push('/login');
      } else if("" !== res.data.error) {
          console.log(res.data.error)
      }
      this.setState({
          data: res.data.data,
          data_show: res.data.data.slice(from, from + page),
          record_count: res.data.data.length,
      })
    }).catch((err) => {
      alert(err)
    })
  }
  render() {
    return (
      <div align='center'>
        <MenuHead />
        <table>
        <tbody>
        <tr>
          <td><input type="text" onChange={this.setKeys} value={this.state.keys} size="15" maxLength="100"></input></td>
          <td><button onClick={this.cleanKeys}>清空</button></td>
        </tr>
        </tbody>
        </table>
        <Table
            head={this.state.head}
            data={this.state.data_show}
            queryData={this.queryBdndFile}
            recordCount={this.state.record_count}
            recordHits={this.state.record_count} />
      </div>
    )
  }
}

export default QueryBdndFile;
